How to do center h1 in the middle of the screen?

Question

Aryan Kumar · Answer

o center an h1 element in the middle of the screen, you can use CSS styling. Here's an example of how to do it:
andlt;h1>Headingandlt;/h1>
CSS:
h1 {
 text-align: center;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
}
The text-align: center; property will center the text of the 
h1 element horizontally within its container. The position: absolute; property will position the
h1 element relative to its nearest positioned ancestor. The 
top: 50%; and left: 50%; properties will position the top-left corner of the
h1 element at the center of its container. Finally, the 
transform: translate(-50%, -50%); property will shift the h1 element up and to the left by half of its own width and height, effectively centering it both horizontally and vertically.
Note that this method assumes that the h1 element has no other content or padding within it, and that its container has
position: relative; set. If these assumptions don't hold, you may need to adjust the CSS code accordingly.

forum

How to do center h1 in the middle of the screen?

Revati S Misra

Can you answer this question?

1 Answers

Liked By